<!-- 主页面 -->
<template>
  <div class="flex w-full h-full">
    <v-md-editor
      v-model="content"
      :mode="store.state.editor.editMode"
      :includeLevel="[1, 2, 3, 4]"
      height="calc(100vh - 60px)"
      :disabled-menus="[]"
      @upload-image="uploadImg"
      ref="editorRef"
      id="editor"
    ></v-md-editor>
  </div>
</template>

<script setup lang="ts">
import { useStore } from "@/store/index"
import useState from "./hooks/useState"
import useSaveDoc from "./hooks/useSaveDoc"
import useUpload from "./hooks/useUpload"
const store = useStore()
const { editorRef, content } = useState()
useSaveDoc()
const { uploadImg } = useUpload()
</script>

<style lang="scss" scoped>
:deep(.vuepress-markdown-body h3) {
  font-size: 1.1rem;
}
:deep(.v-md-editor__main) {
  border: none;
}
</style>
